import { useGLTF } from '@react-three/drei';
import { useRef } from 'react';
import { useFrame } from '@react-three/fiber';
import * as THREE from 'three';

interface ModelProps {
    url: string;
}

const Model: React.FC<ModelProps> = ({ url }) => {
    const { scene } = useGLTF(url);
    const ref = useRef<THREE.Group>(null);

    // 使用 useFrame 来实现动画效果，比如旋转模型
    useFrame(() => {
        if (ref.current) {
            ref.current.rotation.y += 0; // 每帧旋转模型
        }

        // 将模型下移 2 个单位
        if (ref.current) {
            ref.current.position.y = -1; // 修改y轴位置，向下移动
            ref.current.position.x = 0.1; // 向右移动
        }
    });

    return <primitive object={scene} ref={ref} />;
};

export default Model;